<template>

  <view class="container">
    <view style="padding: 40rpx 0;text-align: center;font-size: 42rpx;">
      加入组织
    </view>
    <view style="padding:10rpx 30rpx 100rpx 30rpx;font-size: 30rpx;">
      <text class="invite-title">{{userName}}</text>邀请您加入<text class="invite-title">{{companyName}}</text>-<text class="invite-title">{{deptName}}</text>
    </view>
    <i-panel title="完善您的信息（可选）">
      <view>
        <i-input id="name" v-model="entry.name" title="姓名" placeholder="填写姓名，便于与同事沟通" maxlength="50" @change="bindChange" :errorMessage="errMsgs.nameErrMsg"></i-input>
        <i-input id="mobile" v-model="entry.mobile" title="手机号" placeholder="填写手机号，便于生成组织通讯录" maxlength="20" @change="bindChange" :errorMessage="errMsgs.mobileErrMsg"></i-input>
        <view style="display:flex">
          <i-input id="valicode" style="width: 64%;" v-model="entry.valicode" title="验证码" placeholder="请填写手机验证码" maxlength="200" @change="bindChange" :errorMessage="errMsgs.passwordErrMsg"></i-input>
          <view @tap="getCode" style="height: 100rpx;line-height: 100rpx;width: 30%;">{{vbTime}}{{suffix}}</view>
        </view>
      </view>
    </i-panel>
    <view style="padding:100rpx 0 0 0">
      <button type="primary" open-type="getUserInfo" @getuserinfo="login" style="width: 92%;font-size: 28rpx;height: 86rpx;line-height: 86rpx;"><view style="display:flex;justify-content: center;">
                  <text>接受邀请</text></view>
                </button>
    </view>
    <i-message id="message"></i-message>
  </view>

</template>

<script>
import wxRequest from '@/utils/wxRequest';
import tip from '@/utils/tip';
import dateUtil from '@/utils/date-util';
import Session from '@/utils/session';
import dateTimePicker from '@/utils/datepicker.js';
import util from '@/utils/util.js';

export default {
  data() {
    return {

        entry: {
          op: 1,
          useWx: true,
          companyId: '',
          deptId: ''
        },
        errMsgs: {},
        deptName: '',
        companyName: '',
        userName: '',
        vbTime: "获取验证码",
        //valicode button 内容
        vbDisabled: false,
        //valicode button 是否禁止点击
        currentTime: 61,
        suffix: '',
        useWx: false

    };
  },

  onLoad(options) {
    if (options != undefined) {
      this.deptName = options.deptName;
      this.companyName = options.companyName;
      this.userName = options.userName;
      this.entry.deptId = options.deptId;
      this.entry.companyId = options.companyId;
    }
  },

  mixins: [],
  components: {},
  props: {},
  methods: {
    bindChange(e) {
      this.entry[e.currentTarget.id] = e.detail.detail == undefined ? e.detail.value : e.detail.detail.value;
    },

    async login(e) {
      if (e.detail.errMsg != 'getUserInfo:ok') {
        tip.confirm('您未授权，登录失败！请您务必同意授权，授权成功后，即可正式使用本系统，谢谢！', {}, '操作提示', false);
        return false;
      }

      let userInfo = e.detail.userInfo;
      const data = await wxRequest.Get('wx-login', userInfo); //通知Tab页面需要刷新

      for (let index = 0; index < 5; index++) {
        Session.set('page-' + index, true);
      } //为绑定，转到绑定界面


      this.bingUser();
    },

    async bingUser() {
      //检查
      if (this.entry.name != '' && this.entry.name != undefined && this.entry.name.length > 20) {
        tip.error("姓名长度不能超过20个汉字！");
        return;
      }

      if (this.entry.mobile != '' && this.entry.mobile != undefined) {
        if (this.entry.valicode == '' || this.entry.valicode == undefined) {
          tip.error("如提交手机号，需输入手机验证码！");
          return;
        }
      }

      let bean = {};

      for (let key in this.entry) {
        bean[key] = this.entry[key];
      }

      let url = 'sys/bindUser';
      let data = await wxRequest.Get(url, bean);

      if (data != undefined && data.code >= 1) {
        Session.set('refresh', true);
        tip.confirm('恭喜您，组织加入成功！点击确定按钮返回主页，欢迎您的使用，谢谢！', {}, '操作提示', false).then(function (value) {
          uni.switchTab({
            url: '/pages/index'
          });
        }, function (error) {});
      } else {
        tip.confirm(data.message, {}, '错误提示', false);
      }
    },

    async getCode() {
      let _this = this;

      let mobile = _this.entry.mobile;

      if (util.isMobile(mobile)) {
        let url = 'sys/sendMobileCode';
        let data = await wxRequest.Get(url, {
          mobile: mobile
        });

        if (data != undefined && data.code >= 1) {
          if (data.message != undefined && data.message != '') {
            tip.error(data.message);
          }

          _this.vbDisabled = true; // 设置发送验证码按钮样式

          let interval = null;
          interval = setInterval(function () {
            _this.currentTime--;
            _this.vbTime = _this.currentTime;
            _this.suffix = '秒后可重新获取';

            if (_this.currentTime <= 0) {
              clearInterval(interval);
              _this.vbTime = '重新发送';
              _this.suffix = '';
              _this.currentTime = 61;
              _this.vbDisabled = false;
            }

            _;
          }, 1000);
        } else {
          tip.error(data.message);
          _this.vbDisabled = false;
        }
      } else {
        tip.error('请输入正确的手机号码！');
      }
    }

  },
  computed: {},
  watch: {}
};
</script>
<style >

  .invite-title {
    color: #f50;
    font-weight: 700;
    font-size: 38rpx;
  }

</style>
<style lang="scss" src="@/static/styles/common_form.scss">

</style>